<!--笔记管理页面-->
<template>
  <div class="nm">
    <div class="note-manager">
      <div class="manager-head">
        <div class="head-title">
          <div style="background: #3a64ff; width: 5px; height: 25px; border-radius: 10px"></div>
          <span> 笔记管理 </span>
        </div>
        <div class="manager-options">
          <router-link to="/creator/notemanager/allnotes" active-class="link-active">
            <div class="option">全部笔记</div>
          </router-link>
          <router-link>
            <div class="option">已发布</div>
          </router-link>
          <router-link>
            <div class="option">审核中</div>
          </router-link>
          <router-link>
            <div class="option">未通过</div>
          </router-link>
        </div>
      </div>
      <div>
        <RouterView />
      </div>
    </div>
  </div>
</template>

<style scoped lang="scss">
.note-manager {
  background: white;
  min-height: 800px;
  margin: 20px;
  border-radius: 10px;
  .manager-head {
    border: 1px solid rgba($color: #000000, $alpha: 0);
    .head-title {
      font-size: 20px;
      margin: 20px;
      display: flex;
      span {
        padding-left: 10px;
      }
    }
    .manager-options {
      display: flex;
      padding-left: 25px;
      border-bottom: 1px solid #ececec;
      a {
        text-decoration: none;
        color: black;
        .option {
          padding-bottom: 15px;
          padding-left: 10px;
          padding-right: 10px;
        }
      }
      .link-active {
        color: #3a64ff;
        .option {
          padding-bottom: 15px;
          padding-left: 10px;
          padding-right: 10px;
          border-bottom: 3px solid #3a64ff;
        }
      }
    }
  }
}
</style>
